<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Big Event</title>
    <link href="css/index.css" rel="stylesheet"/>
    <link rel="stylesheet" type="text/css" href="icon/icon1/iconfont.css">
    <script src="http://code.jquery.com/jquery-1.8.0.min.js"></script>

    <script src="js/vue.js"></script>
    <script src="plugin/layer/layer.js"></script>
</head>
<body>
<div class="header">
    <header class="header-fixed" style="width: 100%; top: 0px; left: 0px;">
        <div class="header-inner">
            <a class="icon iconfont icon-dianshiji"></a>
            <div class="nav-bar">


                    <a class="nav-bar-item">视频</a>
                    <a class="nav-bar-item highlight">文章</a>
                    <a class="nav-bar-item">活跃网站</a>

            </div>
            <div class="searcher-bar">
                <div class="searcher-content">
                    <input type="text" maxlength="100" class="Input" placeholder="搜索你感兴趣的内容…">
                </div>
            </div>
                <a class="iconfont icon-sousuo"></a>
            <div class="clearfix">
                <a class="clearfix-item" href="http://bbs.a113n.cn" >社区</a>
                <a class="clearfix-item">反馈</a>
            </div>
        </div>
    </header>
</div>
<div class="main-content">
    <div class="storyContent">
        <div class="storyItem" v-for="summary in summarys" >
            <div class="time">
                <h3>{{summary.month}}月,{{summary.day}}日 --{{summary.year}}</h3>
                <h2>{{summary.name}}</h2>
            </div>
                <div class="storyImgcontent" >
                    <div class="storyImg">
                        <img width="190px" v-bind:src="summary.postimg"/>
                    </div>

                </div>
                <div class="storySummary">

                    <span v-html="summary.summary"> {{summary.summary}}
                    </span>
                </div>
            <div class="ContentItem-action">
                <div class="Action-button">
                    <a class="iconfont icon-huo"></a>
                    <span>5K</span>
                </div>
                <div class="Action-Share  action-item ">
                    <a class="iconfont icon-paper-plane smalliconfont"></a>
                    <span onclick="building()">分享</span>
                </div>
                <div class="Action-Love  action-item">
                    <a class="iconfont icon-shoucang1"></a>
                    <span onclick="building()">收藏</span>
                </div>
                <div class="Action-Plain action-item">
                    <a class="iconfont icon-jubao"></a>
                    <span onclick="building()">投诉</span>
                </div>
            </div>

        </div>


    </div>
</div>
<script src="js/initIndexVue.js"></script>
<!--提前加载，不然会闪现-->
<iframe id="frame" class="timeline-frame" style="border: none; overflow-y:hidden" src="timeline/index.html" height="85px" width="100%" ></iframe>
</body>
<script type="text/javascript">
    function building() {
        layer.msg('功能开发中哦，请期待~');
    }
</script>

<script type="application/javascript">
    getSummary(1997);
</script>
</html>